/*
 * @Description: 
 * @Author: Zhang Zhangda
 * @Date: 2021-03-03 19:37:47
 * @LastEditTime: 2021-03-09 11:26:32
 * @LastEditors: Zhang Zhaoda
 */
import addExcalCss from "./addexcal.less";
import { useSelector, useDispatch } from "react-redux";
import { ExcalModelState, UserModelState } from "umi";
import { Form,message } from 'antd';
import { FC,useEffect,useRef } from "react";
//引入表单组件
import FormItem from "../components/Form"
export interface Istore {
  excal: ExcalModelState
}
interface ILoginStore {
  login: UserModelState
}
const layout = {
  labelCol: { span: 8 },
  
};
const AddExcal: FC = () => {
  //所有考试类型,题目类型,课程类型
  let { isAddOk } = useSelector(({ excal }: Istore) => excal);
  let { userInfo } = useSelector(({ login }: ILoginStore) => login);
  let dispatch = useDispatch()
  let box=useRef(null)
  const [form] = Form.useForm();

  //form表单事件

  const onFinish = (values: any) => {
    console.log(values);
    
    //添加试题
    dispatch({
      type: 'excal/addQuestions',
      payload: { ...values, user_id: userInfo.user_id }
    });
  };

  const onFinishFailed = (errorInfo: any) => {
    console.log('Failed:', errorInfo);
  };
  useEffect(()=>{
    if(isAddOk===1){
      message.success('添加成功')
      form.resetFields();
    (box.current as unknown as HTMLDivElement).scrollTop=0

    }else if(isAddOk===0){
      message.error('')
    }
  },[isAddOk])
  return (
      <div ref={box} className={addExcalCss.addexcal}>
        <div className={addExcalCss.main}>
          <FormItem
            onFinishFailed={onFinishFailed}
            onFinish={onFinish}
            form={form}
            defaultValue={{ exam_id: '周考1', questions_type_id: '简答题', subject_id: 'javaScript上' }}
          />
         
        </div>
      </div>

  );
}
export default AddExcal